<template>
  <form @submit.prevent>
    <slot></slot>
  </form>
</template>

<script>
export default {
  name: 'ElForm',
  provide() {
    return {
      form: this
    }
  },
  props: {
    model: {
      type: Object
    },
    rules: {
      type: Object
    }
  },
  methods: {
    async validate(cb) {
      let children = this.$children
      const arr = []
      function findFormItem(children) {
        children.forEach((child) => {
          if (child.$options.name === 'ElFormItem' && child.prop) {
            arr.push(child)
          }
          if (child.children) {
            findFormItem(child.children)
          }
        })
      }
      findFormItem(children)

      try {
        await Promise.all(arr.map((child) => child.validate()))
        cb(true)
      } catch {
        cb(false)
      }
    }
  }
}
</script>

<style lang="scss" scoped></style>
